<template>
  <common-dialog
    ref="dialog"
    width="1000px"
    title="用户详情"
    :inDialog="inDialog"
    :data="data"
    @closed="onClosed"
  >
    <common-form
      ref="form"
      text-mode
      label-width="100px"
    >
      <el-divider>用户信息</el-divider>
      <el-row :gutter="10">
        <el-col :span="12">
          <el-form-item label="用户ID">{{data.id}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="用户名">{{data.userName}}</el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="10">
        <el-col :span="12">
          <el-form-item label="名称">{{data.name}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="中文名称">{{data.cName}}</el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="10">
        <el-col :span="12">
          <el-form-item label="邮箱">{{data.emailAddress}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="手机">{{data.phoneNumber}}</el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="10">
        <el-col :span="12">
          <el-form-item label="创建时间">{{ data.creationTime }}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="最后更新时间">{{ data.lastModificationTime }}</el-form-item>
        </el-col>
      </el-row>
      <el-divider>职位信息</el-divider>
      <el-table border :data="data.positions">
        <el-table-column
          type="index"
          align="center"
          :width="40"
          label="#"
        />
        <el-table-column label="职位" prop="positionName" width="180">
         <template #default="{row}">
            {{row.positionName}} <el-tag v-if="row.isDefault" type="primary">默认</el-tag> <el-tag v-if="row.isDeleted" type="danger">删除</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="所属部门" prop="organizationName"></el-table-column>
        <el-table-column label="所属职务" prop="jobName" width="100"></el-table-column>
        <el-table-column label="参与审批" prop="isApproval" width="100">
          <template #default="{row}">
            <el-tag v-if="row.isApproval" type="success">是</el-tag> <el-tag v-else type="info">否</el-tag>
          </template>
        </el-table-column>
      </el-table>
    </common-form>
    <template slot="footer">

    </template>
    <detail-dialog
      ref="detailDialog"
      in-dialog
    ></detail-dialog>
  </common-dialog>
</template>
<script>
import commonDialog from "@/components/common/dialog";
import commonForm from "@/components/common/form";
import api from "@/api/sso/user";

export default {
  props: {
    inDialog: {
      type: Boolean,
      default: false
    },
  },
  // mixins: [detailsDialogMixin],
  components: {
    commonDialog,
    commonForm
  },
  data() {
    return {
      syncEsLoading: false,
      syncIcpLoading: false,
      resetNameLoading: false,
      repairLoading: false,
      data: {
        id: "",
        name: "",
        mergerId: "",
        code: "",
        enName: "",
        zhName: ""
      },
      api,
    };
  },
  created() {
    this.$options.components.detailDialog = () => import('./detailDialog')
  },
  methods: {
    openDetail(id) {
      this.$refs.dialog.open().then(() => {
        this.getData(id);
      });
    },
    getData(id) {
      this.$refs.dialog.loading(true);
      api.getDetail(id).then((res) => {
        this.$refs.dialog.loading(false);
        if (res.code != 0) {
          return;
        }
        this.data = res.data;
      });
    },
    onClosed() {
      // this.$refs.commonForm.reset();
    },
    syncCustomerToEs() {
      this.syncEsLoading = true;
      api.syncCustomersToEs({ ids: [this.data.id] }).then(() => {
        this.syncEsLoading = false;
      });
    },
    syncCustomerToIcp() {
      this.syncIcpLoading = true;
      api.syncCustomersToIcp({ ids: [this.data.id] }).then(() => {
        this.syncIcpLoading = false;
      });
    },
    resetNameUniqueValue() {
      this.resetNameLoading = true;
      api.resetNameUniqueValue({ ids: [this.data.id] }).then((res) => {
        this.resetNameLoading = false;
      });
    },
    repairExamineStatus() {
      this.repairLoading = true;
      api.repairExamineStatus({ ids: [this.data.id] }).then((res) => {
        this.repairLoading = false;
      });
    },
    openMainCustomer() {
      this.$refs.detailDialog.openDetail(this.data.mergerId);
    },
    openOldIcpDetail() {
      this.$refs.oldIcpDetailDialog.openDetail(this.data.id);
    },
    relieveMerger() {

    }
  },
};
</script>